.citylist {
  height: 100%;
  padding-top: 45px;

  .am-navbar.am-navbar-light {
    background-color: #f6f5f6;
    color: #333;
    margin-top: -45px;
  }

  .city-list-box {
    padding-left: 10px;
  }

  .city-item-title {
    height: 36px;
    line-height: 36px;
    color: #999;
  }

  .city-item-every {
    height: 50px;
    line-height: 50px;
    color: #333;
    border-bottom: 1px solid #f6f5f6;
  }

  .city-index {
    position: fixed;
    right: 3px;
    top: 50px;
    color: #999;
    display: flex;
    flex-direction: column;
    height: 90%;

    .city-index-item {
      flex: 1;
    }

    .city-index-active {
      color: #fff;
      font-size: 12px;
      width: 15px;
      height: 15px;
      display: inline-block;
      text-align: center;
      line-height: 15px;
      background-color: #21b97a;
      border-radius: 50%;
    }
  }
}